<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>关联项目</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../../../css/mui.min.css" rel="stylesheet" />
		<link href="../css/common.css" rel="stylesheet" />
    <style>
      body{
        background-color: #fff;
      }
      .list{
        padding: 26px 10px;
        position: relative;
      }
      .list +.list{
        border-top: 1px solid #dcdcdc;
      }
      .label{
        color: #fff;
        display: inline-block;
        font-size: 0.6rem;
        padding: 2px 0.8rem;
        border-radius: 3rem;
      }
      .labelR{
        position: absolute;
        right: -0.94rem;
        top: 10px;
        font-size: 0.6rem;
        padding: 2px 0.9rem;
        background: #275EB1;
        color: #fff;
        border-radius: 3rem 0 0 3rem;
      }
      .list:first-child{
        margin-top: 10px;
      }
      .button div{
        padding:0.8rem 0;
      }
      .solid-top{
        border-top: 1px solid #DCDCDC;
      }
      .mui-input-group:before,.mui-input-group:after{
        height: 0px;
      }
      .mui-input-group .mui-input-row:after{
        height: 0px;
      }
      .mui-checkbox input[type=checkbox]:before, .mui-radio input[type=radio]:before{
        font-size: 24px;
      }
      .mui-checkbox input[type=checkbox], .mui-radio input[type=radio]{
        /* top: 5px; */
      }
      .mui-checkbox.mui-left label, .mui-radio.mui-left label{
        /* padding-left: 20px; */
        width: 35%;
      }
      .progress{
        width: 0.8rem;
        height: 0.8rem;
        vertical-align: middle;
        position: relative;
        top: -1px;
        margin-right: 3px;
      }
    </style>
	</head>
	<body>
    <div class="container" id="container" v-cloak>
      <header class="mui-bar mui-bar-nav">
          <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left" @tap="reLoadHome"></a>
          <h1 class="mui-title">关联项目</h1>
		  <a class="mui-icon mui-icon-right-nav mui-pull-right" @click="nextStep"
		  href="javascript:;"><font size="3" color="#fff">下一步</font></a>
		  <a class="mui-icon mui-icon-right-nav mui-pull-right" href="javascript:;"><font>&nbsp;&nbsp;</font></a>
          <a class="mui-icon mui-icon-plusempty mui-icon-right-nav mui-pull-right" style="color: #fff;" @click="add()"></a>
		  
      </header>
      <div id="refreshContainer" class="mui-content bg-white">
        <div class="padding-lr">
          <div class="list flex" v-for="item in list" :key="item.id" @click="detail(item)">
            <div class="labelR" v-if="item.isDefault">
              默认
            </div>
            <div class="" style="min-width: 4rem;">   
              <span class="label bg-yellow" style="line-height: 18px;" v-if="item.auditStatus==1">未审核</span>
              <span class="label bg-red" style="line-height: 18px;" v-else-if="item.auditStatus==2">未通过</span>
              <span class="label bg-green" style="line-height: 18px;" v-else-if="item.auditStatus==3&&!item.isTech">已通过</span>
              <span class="label bg-yellow" style="line-height: 15px;" v-else-if="item.auditStatus==3&&item.isTech">科技公司专<br/>工未审核</span>
              <span class="label bg-red" style="line-height: 15px;" v-else-if="item.auditStatus==4">科技公司审<br/>核拒绝</span>
              <span class="label bg-green" style="line-height: 15px;" v-else-if="item.auditStatus==5">已通过</span>
            </div>
            <div class="padding-left-sm text-cut flex-sub">
              <div class="text-cut">{{item.currentProjectName}}</div>
              <div class="flex justify-between padding-top-sm">
                <div class="text-green text-sm"><img src="../img/progress.png" class="progress"><span>正在进行</span></div>
                <!-- <div class="text-blue text-sm" @click="set(item)"v-if="item.isDefault"><span>取消设置</span></div> -->
                <div v-if="item.auditStatus!=3" class="text-red text-sm" @click.stop="relationProjectDel(item.id)"><span>删除</span></div>
				<div class="text-blue text-sm" @click.stop="set(item)" v-if="!item.isDefault"><span>设置为默认</span></div>
              </div>
            </div>
          </div>
          <div class="padding text-center" v-if="list.length===0">
            <p>暂无数据</p>
          </div>
          <!-- <div class="list flex">
            <div class="labelR">
              默认
            </div>
            <div class="" style="min-width: 4rem;">
              <span class="label bg-yellow">未审核</span>
            </div>
            <div class="padding-left-sm text-cut flex-sub">
              <div class="text-cut">源丰电场风机服</div>
              <div class="flex justify-between padding-top-sm">
                <div class="text-green text-sm"><span>正在进行</span></div>
                <div class="text-blue text-sm"><span>取消设置</span></div>
              </div>
            </div>
          </div> -->
        </div>
      </div>
      <div id="topPopover" class="popUp mui-popover mui-popover-add" data-type="" style="min-height: 20vw; overflow: hidden;">
        <div class="padding flex justify-end">
          <div class="mui-icon mui-icon-closeempty" style="font-size: 30px;" @click="close()"> 
          </div>
        </div>
      	<div class="padding">
         <form class="mui-input-group flex padding-lr align-center">
           <div>是否有单位：</div>
           <div class="mui-input-row mui-radio mui-left flex-sub">
             <label>是</label>
             <input name="radio1" type="radio" value="1" v-model="radio">
           </div>
           <div class="mui-input-row mui-radio mui-left flex-sub">
             <label>否</label>
             <input name="radio1" type="radio" value="0" v-model="radio">
           </div>
         </form>
        </div>
      	<div class="flex justify-between button solid-top margin-top-lg">
      		<div class="flex-sub text-center solid-top right" @click="close()">
      			取消
      		</div>
      		<div class="flex-sub text-center text-white bg-blue" @click="sure()">
      			确定
      		</div>
      	</div>
      </div>
    </div>
    <script src="../../../js/mui.min.js"></script>
    <script src="../../../js/jquery-3.2.1.min.js"></script>
    <script src="../js/mkeyplus.base.js"></script>
    <script type="text/javascript" src="../../../js/vue.js"></script>
    <script src="../formal/js/api.js"></script>
    <script type="text/javascript">
        var htapi = new HTGlobal();
        var user = JSON.parse(localStorage.getItem('outUser'));//当前用户信息
        console.log(JSON.stringify(user))
        var project = null;
        mui.init({
			pullRefresh: {
				container: "#refreshContainer", 
				down: { //下拉刷新
				  style: 'circle',
				  height: 50, //可选,默认50.触发下拉刷新拖动距离,
				  auto: false, //可选,默认false.首次加载自动下拉刷新一次
				  contentdown: "下拉可以刷新", //可选，在下拉可刷新状态时，下拉刷新控件上显示的标题内容
				  contentover: "释放立即刷新", //可选，在释放可刷新状态时，下拉刷新控件上显示的标题内容
				  contentrefresh: "正在刷新...", //可选，正在刷新状态时，下拉刷新控件上显示的标题内容
				  callback: function() { //必选，刷新函数，根据具体业务来编写，比如通过ajax从服务器获取新数据；
				    project.getData()
				    mui('#refreshContainer').pullRefresh().endPulldownToRefresh();
				    // countDown++;
				  }
				}
			}
		});
        mui.plusReady(function() {
          project.getData()
        })
        project = new Vue({
          el: '#container',
          data: {
            list: [],
            radio:''//是否由单位1是0否
          },
          methods:{
			  nextStep(){
				  /** 前往下一步操作
				   * @method nextStep
				   * @param {空}
				   * @return {空}
				  */
				 htapi.synchronizationUserInfo(function(data){
					 var D = data.data || {},
					 auditStatus = D.auditStatus
					 //获取项目状态
					 if(auditStatus!=3 && !D.isTech){
					 	mui.alert('您关联的项目人员信息未经过审核，请联系场站负责人审核，场站操作步骤：关联项目审核->查看->工作人员->待审核人员。')
					 	return false;
					 }
					 if(auditStatus!=5 && D.isTech){
					 	mui.alert('您关联的项目人员信息未经过审核，请联系场站负责人审核，场站操作步骤：关联项目审核->查看->工作人员->待审核人员。')
					 	return false;
					 }
					 mui.openWindow({
					   url: '../course/myCourse.html',
					   id: '../course/myCourse.html',
					   extras: {},
					   waiting: {
					     autoShow: false
					   }
					 })
				 })
			  },
			  relationProjectDel(id){
				  /** 删除关联项目
				   * @method relationProjectDel
				   * @param {id}
				   * @return {空}
				  */
				 if(id){
					 mui.confirm('确定删除吗?', '系统提示', ['是', '否'], function(e) {
					 	if(e.index == 0) {
					         //确认退出触发事件
							 htapi.apiUrl[htapi.apiKey].temporary = htapi.apiUrl[htapi.apiKey].relationProjectDel+id
					         htapi.fetch({},function(data){
								 console.log('删除关联',JSON.stringify(data))
								 project.getData()
							 },'删除中','temporary')
							 delete htapi.apiUrl[htapi.apiKey].temporary
					 	}
					 })
				 }
			  },
			reLoadHome(){
				/** 返回到home页刷新
				 * @method reLoadHome
				 * @param {空}
				 * @return {空}
				*/
			   mui.fire(plus.webview.currentWebview().opener(),'setCurrentProjectName',htapi.getOsUser())
			},
            sure(){//点击确定跳转到关联页面
              var that=this;
              if(that.radio==''){
                mui.toast('请选择是否有单位');
                return
              }
              if(that.radio==1){
                if(user.hasUnit==1){//判断当前有无单位
                  mui.openWindow({
                    url: './projectAdd.html',
                    id: './projectAdd.html',
                    extras: {
                      isUnit: that.radio
                    }
                  });
                }else{
                  mui.toast('当前项目为有单位的人员才可以进行关联，请核对个人信息')
                }
                
              }else{
                mui.openWindow({
                  url: './projectAdd.html',
                  id: './projectAdd.html',
                  extras: {
                    isUnit: that.radio
                  }
                });
              }
            },
            close(){//关闭弹窗
              mui('#topPopover').popover('hide')
            },
            add(){//开启弹窗
              mui('#topPopover').popover('show')
            },
            getData(){//获取数据
              var that = this;
              plus.nativeUI.showWaiting('加载中');
              mui.baseWApp.httpRequst("/outsider/app/backUpAppUser/"+ user.id, {
              }, function(data) {
                if(data.code=='0'){
                  that.list=data.data
                }
                plus.nativeUI.closeWaiting();
               console.log(JSON.stringify(data))
              }, function() {
                plus.nativeUI.closeWaiting();
                console.log("获取数据失败");
              })
            },
            set(item){//设置为默认
              var that=this;
              plus.nativeUI.showWaiting('设置中');
              mui.baseWApp.httpRequst("/outsider/app/backUpAppUser/updateDefault/"+ item.id, {
              }, function(data) {
                if(data.code=='0'){
                  //mui.toast('设置成功')
                  that.getData();
				  //改变用户信息
				  
				  htapi.setOsUser({
					  enterpriseName:item.enterpriseName,
					  currentProjectName:item.currentProjectName,
					  currentProjectId:item.currentProjectId,
					  enterpriseProjectId:item.enterpriseProjectId
				  })
				  
                }else{
                  mui.toast(data.message)
                }
                plus.nativeUI.closeWaiting();
               console.log(JSON.stringify(data))
              }, function() {
                plus.nativeUI.closeWaiting();
                console.log("获取数据失败");
              })
            },
            detail(item){
              // if(item.auditStatus==3){
              //   mui.openWindow({
              //     url: './projectDetail.html',
              //     id: './projectDetail.html',
              //     extras: {
              //       pageId: item.id
              //     }
              //   });
              //   return
              // }
              mui.openWindow({
                url: './projectEdit.html',
                id: './projectEdit.html',
                extras: {
                  pageId: item.id
                }
              });
            }
          }
        })

        window.addEventListener('projectRefresh',function(event){
          mui('#topPopover').popover('hide')
          project.getData(); 
		  htapi.synchronizationUserInfo(false)
        });
        var old_back = mui.back
		mui.back = function(){
			project.reLoadHome()
			old_back()
		}
      </script>
    </body>
	</body>
</html>
